/**
 * Created by liguangsong on 16/8/11.
 */
import React from 'react'
import SearchView from './searchView.js'
import PlayerInfoView from './playerInfoView.js'
import { connect } from 'react-redux'
import { searchChange, cleanFilter } from '../../action/index.js'

var Player = React.createClass({
    getInitialState() {
        this.props.dispatch(cleanFilter());

        return null;
    },

    render() {
        return (
            <div>
                <div className="titleView" style={{background: 'rgb(221, 82, 50)'}}></div>
                <SearchView inputChange={filter => this.props.dispatch(searchChange(filter))}/>

                <div className="playersView">
                    { this.getPlayerInfoView() }
                </div>



            </div>
        )
    },

    getPlayerInfoView() {
        var view = [];
        if (this.props.filter != null) {
            for (var i = 0; i < this.props.filter["name"].length; i++) {
                view.push(
                    <PlayerInfoView key={i} playerId={this.props.filter.id[i]} playerName={this.props.filter.name[i]} playerTeam={this.props.filter.team[i]}/>
                );
            }
        }

        return view;
    }

});

function select(state) {
    return {
        filter: state.searchChange.filter
    }
}

export default connect(select)(Player);